<template>
  <view class="search" @click="handel">
    <text class="lg text-gray" :class="'cuIcon-search'"></text>
    <input
      type="text"
      placeholder="搜索相关文章"
      @input="input"
      confirm-type="search"
      :disabled="disabled"
    />
  </view>
</template>

<script>
export default {
  props: {
    value: {
      type: String,
      default: () => "",
    },
    disabled: {
      type: Boolean,
      default: false,
    },
    url: {
      type: String,
      default: "",
    },
  },
  methods: {
    input(e) {
      this.$emit("input", e.target.value);
    },
    handel() {
      if (this.url != "") {
        console.log(121);
        uni.navigateTo({
          url: this.url,
        });
      }
    },
  },
};
</script>

<style scoped lang="scss">
.search {
  width: 686rpx;
  height: 64rpx;
  background: rgba(255, 255, 255, 1);
  border-radius: 32rpx;
  margin-top: 56rpx;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  > text {
    margin-left: 29rpx;
    margin-right: 15rpx;
    font-size: 30rpx;
  }
  > input {
    height: 100%;
    line-height: 64rpx;
    font-size: 28rpx;
    width: 100%;
  }
}
</style>
